<script setup>
import { getProList ,getProinfo,getProAdd,getProDel} from "./api/home";
// 请求商品列表
// getProList().then((res) => console.log(res));
// 请求商品详情
// getProinfo().then((res) => console.log(res));
// 请求商品详情
// getProinfo({
//   proid:10086,

// }).then((res)=>{
//   console.log(res);
// })

function add(){
  // console.log('点击了添加商品按钮');
  getProAdd({
    proid:10086,
    proname:'新增了一个商品'
  }).then((res)=>{
    console.log(res); 
    // 为了验证有没有添加上,所以在这里再次请求一个商品列表
    getProList().then((res) => console.log(res));
  })
}

function DEL(){
  // console.log('shanchu');
  
  getProDel({
    proid:10086
  }).then(res=>{
    // console.log(res);
      // 为了验证有没有删除成功,所以在这里再次请求一个商品列表
      getProList().then((res) => console.log(res.string));


  })
}

</script>

<template>
 <h1>首页</h1>
 <button @click="add">点击添加商品</button>
 <button @click="DEL">点击删除商品</button>
</template>

<style scoped>
header {
  line-height: 1.5;
}

.logo {
  display: block;
  margin: 0 auto 2rem;
}

@media (min-width: 1024px) {
  header {
    display: flex;
    place-items: center;
    padding-right: calc(var(--section-gap) / 2);
  }

  .logo {
    margin: 0 2rem 0 0;
  }

  header .wrapper {
    display: flex;
    place-items: flex-start;
    flex-wrap: wrap;
  }
}
</style>
